<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>粘性选项卡</title>
		<link rel="stylesheet" href="/H5/css/index.css" />
	</head>
	<body>
		
			
		
		<nav id="hi-tab">
		</nav>
		<div class="test-down-area">
			<div id="s1">
				<p>官方歌单</p>
			</div>
			<div id="s2">
				<p>达人歌单</p>
			</div>
			<div id="s3">
				专区
			</div>
			<div id="s4">
				区域4
			</div>
			<div id="s5">
				区域5
			</div>
		</div>
	</body>
	<script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
	<script src="/H5/js/index.js"></script>
	<script>
		var option = {
			paddingTop: "10px",
			paddingBottom: "10px",
			fontSize: "15px",
			showNum: 5,
			tab:{
				list:[//选项集合
					{content: '推荐'},
					{content: '音乐馆'},
					{content: '电台'},
					{content: '播客'},
					{content: '选项5'}
				],
				selectIndex: 0//选中选项索引
			},
			areaList:[//选项对应跳转区域集合
				{selector: '#s1'},
				{selector: '#s2'},
				{selector: '#s3'},
				{selector: '#s4'},
				{selector: '#s5'}
			],
			skipTime: 300  //跳转所需时间
		}
		initTab(option)
	</script>
</html>
